{% extends "layout.html" %}

{% block title %}主号{% endblock %}

{% block css %}{% endblock %}

{% block cardbody %}
<div class="layui-form">
    <div class="layui-form-item layui-row">    
      <div class="layui-input-group layui-col-xs6">
        <div class="layui-input-split layui-input-prefix">
          用户名
        </div>
        <input id="UserName" type="text" placeholder="请输入在海角的用户名" class="layui-input">
      </div>
      <div class="layui-input-group layui-col-xs6">
        <div class="layui-input-split layui-input-prefix">
          密码
        </div>
        <input id="UserPwd"	lay-affix="eye" type="password" placeholder="请输入在海角的密码" class="layui-input">
        <div class="layui-input-suffix ">
          <button onclick="Proims()" class="layui-btn layui-btn-primary">登录</button>
        </div>
      </div>
    </div>



  </div>

  <hr style="margin: 22px 0;">



  <div class="layui-row UserSt">
    <div class="layui-col-xs6 layui-col-md12">
        <div class="grid-demo grid-demo-bg2">
            <span class="layui-breadcrumb" id="Usersta" lay-separator="|">
                <a href="">
                    <i class="iconfont icon-fensi"></i>
                    <span title="目前粉丝量">粉丝量</span>
                </a>
                <a href="">
                    <i class="iconfont icon-zuanshi"></i>
                    <span title="钻石">钻石</span>
                </a>
                <a href="">
                    <i class="iconfont icon-jinbi"></i>
                    <span title="金币">金币</span>
                </a>
                <a href="">
                    <i class="iconfont icon-wodeguanzhu"></i>
                    <span title="我的关注">我的关注</span>
                </a>
                <a href="">
                    <i class="iconfont icon-tiezixiugai"></i>
                    <span title="账号发布的帖子">发布的帖子</span>
                </a>
                
                <a href="">
                    <i class="iconfont icon-pinglun"></i>
                    <span title="评论别人的帖子数量">评论</span>
                </a>
              </span>
        </div>
      </div>
  </div>

  <hr style="margin-top: 22px 0;">


{% endblock %}

{% block js %}

<script>
function Ohja(params) {
    let spanAll = document.querySelectorAll("#Usersta a span");
    spanAll[0].innerHTML = params.user.fansCount;
    spanAll[5].innerHTML = params.user.commentCount;
    spanAll[5].innerHTML = params.user.commentCount;
    spanAll[4].innerHTML = params.user.topicCount;
    spanAll[2].innerHTML = params.user.gold;
    spanAll[3].innerHTML = params.user.favoriteCount;
}
function Proims() {
        var loadIndex = layer.msg('加载中', {
            icon: 16,
            shade: 0.5,
            title: "稍等一会...",
            content: "服务器正在进行操作",
            anim: 6,
            time: 0
        });

        let username = document.querySelector("#UserName").value;
        let userpwd = document.querySelector("#UserPwd").value;
        console.log(username,userpwd);

        axios({
            url: "/user/boos/",
            method: "POST",
            headers: {
                "Content-Type": "application/x-www-form-urlencoded"
            },
            data: {
                "UserName": username,
                "UserPwd":userpwd,
            }
        }).then(res => {
            console.log("响应成功: ", res);
            if (res.data.success) {
                layer.msg("登录成功",{
                time:3000
            });
            Ohja(res.data.data)
            } else {
                layer.msg(res.data.data,{
                time:3000
            })
            }
            
            layer.close(loadIndex);
        }).catch(error => {
            console.error("响应失败: ", error);
            layer.close(loadIndex);
        });
    }




</script>
{% endblock %}